/* 
		该文件用于：
				1.创建整个应用的路由管理者 ——  路由器
				2.指定一组一组的路由规则
*/
//引入Vue核心库
import Vue from 'vue'
//引入VueRouter
import VueRouter from 'vue-router'
//引入组件
import About from '../pages/About'
import Home from '../pages/Home'
import Message from '../pages/Message'
import News from '../pages/News'
import Detail from '../pages/Detail'
//使用插件（应用插件）
Vue.use(VueRouter)

//创建并暴露一个router
export default new VueRouter({
	//配置一组一组的路由规则
	routes:[
		{
			name:'guanyu',
			path:'/about', //路径
			component:About //组件
		},
		{
			name:'zhuye',
			path:'/home', //路径·
			component:Home, //组件
			children:[
				{
					name:'xiaoxi',
					path:'message',
					component:Message,
					children:[
						{
							name:'xiangqing',
							path:'detail', 
							component:Detail,

							// 路由配置中props的第一种写法（布尔值），作用：将路由所收到的所有的params参数，都以props的形式传递给路由组件
							// props:true 

							// 路由配置中props的第二种写法（对象），作用：将对象中每一组key-value都以以props的形式传递给路由组件
							/* props:{
								id:'4567890-98tre45rty8u9i0-98765467890-',
								title:'rtdfyguhiljo;iufdy546fugihojk;piuthry',
								a:100,
								b:200,
								c:[2,4,6,8,10]
							} */

							// 路由配置中props的第三种写法（函数），作用：将函数返回的那个对象中每一组key-value都以以props的形式传递给路由组件
							// 关键点在于：参数
							props(route){
								return {...route.query}
							}
						}
					]
				},
				{
					name:'xinwen',
					path:'news',
					component:News,
				},
			]
		},
	]
})


